import type { Directive, DirectiveBinding } from 'vue';
import { nextTick } from 'vue'

const focus: Directive = {
	mounted: (el: HTMLElement, bind: DirectiveBinding) => {
		const {value} = bind;

		if (value === true) {
			if (el.tagName === 'INPUT' || el.tagName === 'TEXTAREA') {
				nextTick(() => {
					el.focus();
				});
			} else {
				const input: any = el.querySelector('input,textarea');
				if (input) {
					nextTick(() => {
						input.focus();
					});
				}
			}
		}
	},
};

export default focus;
